<div class="portlet light">
    <div class="portlet-title">
        <div class="caption">
            <span class="caption-subject">Input Mask</span>
        </div>
    </div>
    <div class="portlet-body">

        <form role="form">

            <div class="form-group form-md-line-input form-md-floating-label row">
                <label class="col-md-2 control-label">Date</label>
                <div class="col-md-10">
                    <div class="input-group">
                        <div class="input-group-control">
                            <input type="text" class="form-control input-mask" data-inputmask="'alias': 'date'">
                            <label>Date</label>
                        </div>
                        <span class="input-group-btn btn-right">
                            <button class="btn green-haze test-btn-input-mask" type="button">@L("Submit")</button>
                        </span>
                    </div>
                </div>
            </div>
            
            <div class="form-group form-md-line-input form-md-floating-label row">
                <label class="col-md-2 control-label">Numeric with length</label>
                <div class="col-md-10">
                    <div class="input-group">
                        <div class="input-group-control">
                            <input type="text" class="form-control input-mask" data-inputmask="'mask': '9', 'repeat': 10, 'greedy' : false">
                            <label>Numeric</label>
                        </div>
                        <span class="input-group-btn btn-right">
                            <button class="btn green-haze test-btn-input-mask" type="button">@L("Submit")</button>
                        </span>
                    </div>
                </div>
            </div>
            
            <div class="form-group form-md-line-input form-md-floating-label row">
                <label class="col-md-2 control-label">Numeric with mask</label>
                <div class="col-md-10">
                    <div class="input-group">
                        <div class="input-group-control">
                            <input type="text" class="form-control input-mask" data-inputmask="'mask': '99-9999999'">
                            <label>Numeric</label>
                        </div>
                        <span class="input-group-btn btn-right">
                            <button class="btn green-haze test-btn-input-mask" type="button">@L("Submit")</button>
                        </span>
                    </div>
                </div>
            </div>
            
            <div class="form-group form-md-line-input form-md-floating-label row">
                <label class="col-md-2 control-label">Currency</label>
                <div class="col-md-10">
                    <div class="input-group">
                        <div class="input-group-control">
                            <input type="text" class="form-control input-mask" data-inputmask="'alias': 'numeric', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'prefix': '$ ', 'placeholder': '0'">
                            <label>Currency</label>
                        </div>
                        <span class="input-group-btn btn-right">
                            <button class="btn green-haze test-btn-input-mask" type="button">@L("Submit")</button>
                        </span>
                    </div>
                </div>
            </div>

        </form>

    </div>
</div>